#{extends 'main.html' /}
#{set 'title'}&{'admin.pages.all.page.title'}#{/set}

<script>
	function optionsFormatter(value, row) {

		return  '<div class="btn-group">'+
			'<a href="/admin/users/edit/'+value+'" class="btn btn-xs btn-primary"><i class="fa fa-fw fa-pencil"></i>'+"&{'admin.users.all.table.button.edit'}"+'</a>'+
			'<button class="btn btn-xs btn-primary dropdown-toggle" data-toggle="dropdown">'+
				'<span class="caret"></span>'+
			'</button>'+
			'<ul class="dropdown-menu">'+
				'<li><a href="/admin/users/delete/'+value+'" ><i class="fa fa-fw fa-trash-o"></i>'+"&{'admin.users.all.table.button.delete'}"+'</a></li>'+
			'</ul>'+
		'</div>';
	}

	function searchFields(params) {
		var fields = ['name','description'];
		params['searchFields'] = fields;
		return params;
	}
</script>

<div id="content">

	<!-- Heade Content-->
	<div class="row">
		<!-- Breadcrumb-->
		<div class="col-xs-12 col-sm-7 col-md-7 col-lg-4">
			<h1 class="page-title txt-color-blueDark">
				<i class="fa fa-table fa-fw "></i> 
				<a href="/admin/pages/all">&{'admin.pages.all.page.title'}</a> <span>> &{'admin.pages.all.breadcrumb'}</span>
			</h1>
		</div>
		<!-- Action buttons-->
		<div class="col-xs-12 col-sm-5 col-md-5 col-lg-8">
			<ul id="sparks" class="">
				<li class="sparks-info">
					<a href="/admin/pages/add" class="btn btn-primary">&{'admin.pages.all.button.new'}</a>
				</li>
			</ul>
		</div>
	</div>

	<!-- Body Content -->
	<section id="widget-grid" class="">
		<article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
			<div class="jarviswidget jarviswidget-color-blueDark" id="wid-id-0" data-widget-editbutton="false">

				<header>
					<span class="widget-icon"> <i class="fa fa-table"></i> </span>
					<h2>&{'admin.pages.all.page.title'}</h2>
				</header>

				<div>
					<div class="widget-body" >
						<div class="table-responsive">
							<table class="table table-condensed table-bordered"
								data-toggle="table"
								data-url="/admin/pages/list"
								data-side-pagination="server"
								data-pagination="true"
								data-page-list="[5, 10, 20, 50, 100, 200]"
								data-page-size="5"
								data-sort-name="name"
								data-sort-order="asc"
								data-search="true"
								data-query-params="searchFields">
								<thead>
									<tr>
										<th data-field="module" data-align="left" data-sortable="true">&{'admin.pages.all.table.header.module'}</th>
										<th data-field="name" data-align="left" data-sortable="true">&{'admin.pages.all.table.header.name'}</th>
										<th data-field="description">&{'admin.pages.all.table.header.description'}</th>
										<th data-field="id" data-align="center" data-width="200" data-formatter="optionsFormatter">&{'template.general.table.header.options'}</th>
									</tr>
								</thead>
							</table>
						</div>
					</div>
				</div>
			</div>
		</article>
	</section>
</div>